<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" href="styles/index.css">
    <link rel="stylesheet" href="styles/companyInformation.css">
    <!-- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> -->
    <script src="js/jq.js"></script>
    <!-- <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> -->

</head>
<body>
        <div class="load" style="text-align:center;line-height: 50px;">请求数据中...</div>
             <div class="box">
                <div class="headerTab">
                    <ul class="headerTabUl">
                        <li class="on headerTabUl_sun1"></li>
                        <li class="headerTabUl_sun2"></li>
                        <li class="headerTabUl_sun3"></li>
                    </ul>
                </div>
               
                <div class="contentBox2">
                        <div class="box2_time">
                                <table cellspacing="0" cellpadding="0">
                                    <tr>
                                        <td>报告期</td>
                                        <td class="EndDate">
                                           <select name="effects" id="effectTypes"> </select>
                                        </td>
                                    </tr>
                                </table>
                              </div>
                <div class="box2 active">
          
                  <div class="tab1">              
                  <div class="box2_table">
                    <table cellspacing="0" cellpadding="0">
                      
                    </table>
                  </div>
            
                  </div>

                </div>
                <div class="box2">
          
                     <div class="tab2">
                                  <div class="box2_table">
                            <table cellspacing="0" cellpadding="0">
                              
                            </table>
                    </div>
             
                     </div>
         
                </div>
                <div class="box2">
           
                     <div class="tab3">
                         <div class="box2_table">
                            <table cellspacing="0" cellpadding="0">
                              
                            </table>
                      </div>
                     </div> 
                </div>
            </div>
             </div>
           </div>

        <script>

        $(function(){
            const url=encodeURI(document.location.toString())
            // const stockCode=url.split('stockCode=')[1].split('&')[0]
            // const language=url.split('stockCode=')[1].split('&')[1].split('language=')[1]
            const stockCode='SZ.000633'
            const language='cn'
            const timestamp=''
            const headers={
                'X-Requested-With': 'XMLHttpRequest',
                'Access-Control-Allow-Origin': '*',
                "Access-Control-Allow-Methods": "POST,GET",
                'Access-Control-Allow-Credentials': true,
                'Access-Control-Expose-Headers': 'FooBar',
                'Content-Type': 'application/json;charset=UTF-8',
                'Accept': 'application/json',
                'language':language,
                // 'token':'eyJhbGciOiJIUzI1NiJ9.eyJqdGkiOiIxNyIsImlhdCI6MTU0NzI4NjYyNSwic3ViIjoie1widXNlcklkXCI6MTd9IiwiZXhwIjoxNTQ3Mjg4MzUzfQ.N4Cm8QnbgBUlNs3DcTIprQKQJjHhmBxLLJyDc66IXCA'
      }

            
            $(".headerTabUl li").off("click").on("click",function(){
               var index = $(this).index();
               $(this).addClass("on").siblings().removeClass("on");
               $(".contentBox2 .box2").eq(index).addClass("active").siblings().removeClass("active");
             });
            //接口
            $('.box2_time').css('display','none')
            AJAX(timestamp||'')
            function AJAX(timestamp){
                $.ajax({
               type:"get",    //请求方式
               async:true,    //是否异步
               url:"/api/stock-server/v1/stock/finance/"+stockCode,
               dataType :'JSON',
               headers:headers,
               data:{'timestamp':timestamp},
               success:function(data){
                $('.load').css('display','none')
                   if(data.status=='-1'){
                       alert(data.msg)
                       return
                   }
                   if(data.data){
                    $('.box2_time').css('display','block')
                   }
                   var timestamps=data.data.timestamps
                   timestamps.forEach(element => {
                       $('#effectTypes').append('<option class="btn" value="'+element+'">'+ts(element)+'</option>')
                   });
                var data=data.data.data
               let arrTitle=[]//表格标题
               let arrContent=[]//表格内容数组
                   for(var i in data){
                    arrTitle.push(i)
                    arrContent.push(data[i])
                   }
                   $('.headerTabUl_sun1').html(arrTitle[0])
                   $('.headerTabUl_sun2').html(arrTitle[1])
                   $('.headerTabUl_sun3').html(arrTitle[2])
                //    $('.EndDate').append(arrContent[0].报告期.slice(0,10))
              
                $('.tab1 table').html('')
                $('.tab2 table').html('')
                $('.tab3 table').html('')
                  for(var i in arrContent[0]){
                     if(arrContent[0][i]&&i!=='报告期'){
                         if(!isNaN(arrContent[0][i])){
                            arrContent[0][i]=num(arrContent[0][i])
                         }
                        if(arrContent[0][i].slice(4,5)=='-'){
                            arrContent[0][i]=arrContent[0][i].slice(0,10)
                        }
                        console.log(arrContent[0])
                        $('.tab1 table').append('<tr><td>'+i+'</td><td>'+arrContent[0][i]+'</td></tr>')
                     }
                   
                  }
                  for(var i in arrContent[1]){
                     if(arrContent[1][i]){
                         if(!isNaN(arrContent[1][i])){
                            arrContent[1][i]=num(arrContent[1][i])
                         }
                         if(arrContent[1][i].slice(4,5)=='-'){
                            arrContent[1][i]=arrContent[1][i].slice(0,10)
                        }
                        $('.tab2 table').append('<tr><td>'+i+'</td><td>'+arrContent[1][i]+'</td></tr>')
                     }
                   
                  }
                  for(var i in arrContent[2]){
                     if(arrContent[2][i]){
                         if(!isNaN(arrContent[2][i])){
                            arrContent[2][i]=num(arrContent[2][i])
                         }
                         if(arrContent[2][i].slice(4,5)=='-'){
                            arrContent[2][i]=arrContent[2][i].slice(0,10)
                        }
                        $('.tab3 table').append('<tr><td>'+i+'</td><td>'+arrContent[2][i]+'</td></tr>')
                     }
                   
                  }

                        
        
             }
            })
            }
           
            $('#effectTypes').on('change',function(){
                AJAX($(this).val())
            })
            function ts(ts1){
                    var date = new Date(ts1*1000);
           
                            Y = date.getFullYear() + '-';
                            M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
                            D = date.getDate() + ' ';
                            h = date.getHours() + ':';
                            m = date.getMinutes() + ':';
                            s = date.getSeconds(); 

                        return (Y+M+D)
                }
            function num(num){
                if(num<0){
                    num = -num
                    if(num>9999&&num<=99999999){
                    return (num/10000).toFixed(2)+'万元'
                }else if(num>99999999&&num<=999999999999){
                    return '-'+(num/100000000).toFixed(2)+'亿元'
                }else if(num>99999999){
                    return '-'+(num/1000000000000).toFixed(2)+'万亿元'
                }else{
                    return '-'+num+'元'
                }
                }else{
                    if(num>9999&&num<=99999999){
                    return (num/10000).toFixed(2)+'万元'
                }else if(num>99999999&&num<=999999999999){
                    return (num/100000000).toFixed(2)+'亿元'
                }else if(num>99999999){
                    return (num/1000000000000).toFixed(2)+'万亿元'
                }else{
                    return num+'元'
                }
                }
               
            }
        
          });
    </script>
</body>
</html>